$(document).ready(function(){
    getPhoto();
    $("#photoBox").delegate(".img","mouseover",function(){
    	$(event.target).parents(".photo").find(".box").slideDown();
    })
    $("#photoBox").delegate(".img","mouseout",function(){
    	$(event.target).parents(".photo").find(".box").slideUp();
    })
})
var photoBox = document.getElementById("photoBox");
var aLi = photoBox.getElementsByTagName("li");
var iLen = aLi.length;

function getPhoto(){
	$.ajax({
		url : "http://localhost:8080/CLASS/index/getallM.do",
		datatype : "json",
		type : "post",
		success : function(data){
			operatePhoto(data);
		},
		error : function(){
			alert("出错了");
		}
	})
}
function operatePhoto(data){
	console.log(data);
	for(var i in data){
		//获取高度最短的li
		var _index = getShort();
		var oDiv = document.createElement("div");
		oDiv.className = "photo";
		var aA = document.createElement("a");
		aA.href = "http://localhost:8080/CLASS/showMemInfo.do?memberid="+data[i].memberid;
		oDiv.appendChild(aA);
		//遮罩层显示内容
		var shade_box = document.createElement("div");
		shade_box.className = "box";
		//创建一个input存储memberid
		var memberid = document.createElement("input");
		memberid.className = "hidden";
		memberid.type = "hidden";
		memberid.value = data[i].memberid;
		shade_box.appendChild(memberid);
		aA.appendChild(shade_box);
		var shadow_p = document.createElement("p");
		shadow_p.innerHTML = data[i].membername;
		shadow_p.style.color = "#fff";
		shadow_p.style.textAlign = "center";
		shade_box.appendChild(shadow_p);
		var oImg = document.createElement("img");
		oImg.className = "img";
		oImg.style.display = "block";
		oImg.style.width = "250px";
		oImg.style.height = "auto";
		oImg.src = data[i].photo;
		if(data[i].photo != null){
			aA.appendChild(oImg);
		}
		aLi[_index].appendChild(oDiv);
	}
}
//获取最短的li
function getShort(){
	var index = 0;
	var ih = aLi[index].offsetHeight;
	for(var i = 1; i < iLen;i++){
		if(aLi[i].offsetHeight < ih){
			index = i;
			ih = aLi[i].offsetHeight;
		}
	}
	return index;
}